<template>
  <el-config-provider :locale="appStore.language === 'en' ? en : zhCn">
    <router-view></router-view>
  </el-config-provider>
</template>

<script setup>
// import zhCn from 'element-plus/lib/locale/lang/zh-cn'
// import en from 'element-plus/lib/locale/lang/en'

import zhCn from "element-plus/dist/locale/zh-cn.mjs";
import en from "element-plus/dist/locale/en.mjs";

import { useThemeStore } from "@/store/theme.ts";
let themeStore = useThemeStore()
import { useUserStore } from "@/store/user.ts";
let userStore = useUserStore()
import { useAppStore } from "@/store/app.ts";
let appStore = useAppStore()

import { onMounted, getCurrentInstance } from 'vue'
import { generateNewStyle, writeNewStyle } from '@/utils/theme'
// 不能通过这种方式导入 报错，应该是 app.vue是同步导入，并不是异步加载，加载app.vue的时候i18n还没有初始化完成。
// import { watchSwitchLang } from '@/utils/i18n'

generateNewStyle(themeStore.mainColor).then((newStyleText) => {
  writeNewStyle(newStyleText)
})

onMounted(async () => {
  // 导入工具包 动态导入
  const { watchSwitchLang } = await import('@/utils/i18n')
  // console.log(watchSwitchLang)
  watchSwitchLang(() => {
    if (userStore.token) {
      userStore.getUserInfo()
    }
  })
})
</script>

<style></style>
